<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@page import="com.shreecon.lms.common.EmployeeDetailsView"%>
<%@page import="com.shreecon.lms.common.LeaveDetailView"%><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Apply Leave</title>

<script type="text/javascript" src="js/jquery.min.js">
	
</script>

<script type="text/javascript" src="js/date.js"></script>
<script type="text/javascript" src="js/jquery.datePicker.js"></script>
<script type="text/javascript" src="scripts/jquery.bgiframe.min.js"></script>

<script type="text/javascript" charset="utf-8">
	$( function() {
		$('.date-pick').datePicker()
	});
</script>
<link rel="stylesheet" href="css/datePicker.css" media="screen"
	type="text/css">
<style type="text/css">
/* located in demo.css and creates a little calendar icon
 * instead of a text link for "Choose date"
 */
a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(images/calendar.png) no-repeat;
}

a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}

/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
	width: 140px;
	float: left;
}
</style>
</head>

<body>
<form action="LeaveServlet" method="post">
<%
    String errorMessage = (String) request.getAttribute("error");
%>
<table align="center">
	<tr>
		<td align="left"><img src="images\LOGO1.png" align="left"></td>
	</tr>
</table>
<%
    EmployeeDetailsView empView = (EmployeeDetailsView) request
		    .getSession().getAttribute("employeeDetailsView");
%> <%
     if (empView != null && !empView.getLeaveDetails().isEmpty()) {
 %>
<table align="center" border="1">
	<thead>
		<tr>
			<th colspan="3">Leave details for <%=empView.getName()%></th>
		</tr>
		<tr>
			<th>Casual Leave</th>
			<th>Sick Leave</th>
		</tr>
	</thead>
	<tbody>
		<%
		    for (LeaveDetailView view : empView.getLeaveDetails()) {
		%>
		<tr>
			<td><%=view.getLeaveName()%></td>
			<td><%=view.getNumberOfDaysLeave()%></td>
		</tr>
		<%
		    }
		%>
	</tbody>
</table>
<table align="left">
	<tr>
		<td>
		<%
		    if (errorMessage != null && !errorMessage.isEmpty()) {
		%> <font
			style="font-family: cursive; font-size: x-small; color: red"><%=errorMessage%>
		</font> <%
     }
 %>
		</td>
	</tr>
</table>
<br>
<table align="left">
	<tr>
		<td>From Date:</td>
		<td><input type="text" name="fromdate" class="date-pick" readonly="readonly"/></td>
	</tr>
	<tr>
		<td>To Date:</td>
		<td><input type="text" name="todate" class="date-pick" readonly="readonly"/></td>
	</tr>
	<tr>
		<td>Type of Leave :</td>
		<td><select name="typeOfLeave">
			<option value="C">Casual Leave</option>
			<option value="S">Sick Leave</option>
		</select></td>
	</tr>
	<tr>
		<td colspan="2"><input type="submit" value="Apply"></td>

	</tr>
</table>
<%
    } else {
%>
<table align="center" border="1">
	<tr>
		<td colspan="2"><font color="red"> No Leave Configuration
		Found for you !</font></td>
	</tr>
</table>
<%
    }
%>
</form>
</body>
</html>